/**
 *  @author xuezhenan
 *  options{
 *  	width://弹窗宽度
 *  	height://弹窗高度
 *  	onSave://确定回调
 *  }
 */
define(function(require, exports, module){
	function isUndefined(i) {
		return "undefined" == typeof i;
	}

	function isString(i) {
		return typeof i == "string";
	}

	
	var board = function(jq, conf){
		var defaults = {
				width : 500,
				height: 400,
				onSave:function(url){}
		}
		var opt = this.options = $.extend({}, defaults, conf);
		var board = this;
		board.element = $(jq);
		board.canvas = $('<div style="overflow-y:hidden;"></div>')
							.insertAfter(this.element)
							.dialog({
								title:"签名板",
								width:opt.width,
								height:opt.height,
								closed:true,
								modal: true,
								href:BASEPATH+'/resource/js/component/drawBoard/canvas.html',
								onLoad:function(){
									var canvas = board.canvas.canvas = document.getElementById("draw-canvas");
									board.canvas.width = canvas.width = canvas.parentElement.offsetWidth;
									board.canvas.height = canvas.height = canvas.parentElement.offsetHeight;
									var ctx = board.canvas.context=canvas.getContext("2d");
								    //canvas画笔颜色
								    var linecolor="black";  
								    //canvas画笔宽度 
								    var linw=4;
								    //鼠标按下标记  
								    var onoff=false;
								    //初始坐标偏移
								    var oldx=-10;  
								    var oldy=-10;  
									
								    //画一个黑色矩形  
								    ctx.fillStyle="rgba(225,225,225,0)";  
								    ctx.fillRect(0,0,canvas.width,canvas.height);
								    //改变画笔颜色
								    $('.draw-btn').on('click',function(){
								    	linecolor = $(this).data('color');
								    });
								    //改变画笔粗细
								    $('#draw-sel').on('change',function(){
								    	linw=$(this).val();  
								    });
								    //鼠标移动事件，事件绑定  
								    canvas.addEventListener("mousemove",draw,true);  
								    canvas.addEventListener("mousedown",down,false);  
								    canvas.addEventListener("mouseup",up,false);
									//鼠标按下事件
								    function down(event){ 
								        onoff=true;  
								        oldx=event.offsetX-10;  
								        oldy=event.offsetY-10;  
								    } 
								    //鼠标离开事件
								    function up(){  
								    	onoff=false;  
								    }
								    //画事件
								    function draw(event){  
								        if(onoff==true){
								            var newx=event.offsetX-10;  
								            var newy=event.offsetY-10;  
								            ctx.beginPath();  
								            ctx.moveTo(oldx,oldy);  
								            ctx.lineTo(newx,newy);  
								            ctx.strokeStyle=linecolor;  
								            ctx.lineWidth=linw;  
								            ctx.lineCap="round";  
								            ctx.stroke();  
								              
								            oldx=newx;  
								            oldy=newy;  
								        }  
								    } 
 
								},
								buttons: [{
									text: '确定',
									iconCls: 'icon-ok',
									accessKey: {
										akey: 18,
										mkey: 83
									},
									handler: function() {
										board.save.apply(board);
									}
								}, {
									text: '取消',
									addClass: 'l-btn-red',
									iconCls: 'icon-not',
									accessKey: {
										akey: 18,
										mkey: 67
									},
									handler: function() {
										board.close.apply(board);
										
									}
								}, {
									text: '重写',
									iconCls: 'icon-not',
									handler: function() {
										board.reset.apply(board);
									}
								}]
							});
		
	};
	board.prototype={
		constructor: board,
		open:function(){
			this.canvas.dialog('open').dialog('resize', {
				top: (window.innerHeight - this.canvas.dialog("options").height) / 2
			});
		},
		reset:function(){
			var width = this.canvas.width||0;
			var height = this.canvas.height||0;
			var ctx = this.canvas.context;
			ctx&&ctx.clearRect(0,0,width,height);
		},
		close:function(){
			this.reset();
			this.canvas.dialog('close');
		},
		save:function(){
			var img=this.canvas.canvas.toDataURL();
			//"
			try{
				var a = img.split(',');
				var base64 = a[1];
				var b = a[0].split(';')[0];
				var ext = b.split('/')[1];
				var board = this;
				seajs.use("resource/js/component/ajax.js",function(ajax){
					ajax.init().success(function(code,msg,data){
						var onSave = board.options.onSave;
						onSave && $.isFunction(onSave) && onSave.apply(board, [data]);
						board.close();
					}).post(BASEPATH+'/base/authoriza/fileup/uploadImg.htm',{files:base64,fileExt:ext});
				});
			}catch(err){
				alert('保存失败')
			}

		}
	};
	
	$.fn.drawBoard = function(conf){
			var r, a = Array.prototype.slice.call(arguments, 1);
			return this.each(function() {
				var method, drawBoard = $(this).data('drawBoard');
				if (!drawBoard) {
					$(this).data('drawBoard', drawBoard = new board(this, conf));
				}
				isString(conf) && $.isFunction(method = drawBoard[conf]) && (r = method.apply(drawBoard, a))
			}), isUndefined(r) ? this : r
	};
});